<template>
    <div>
        <h1>我是子组件</h1>
        <div>我的父亲传过来的值</div>
        <div>我的父亲名字是{{fatersj.fatername}},他已经{{fatersj.faterage}}岁了</div>
        <div @click="fqcd">向父亲问好</div>
        <div @click="sonHander">用setup父</div>
        <slot></slot>
    </div>
</template>
<script>
import { toRef } from '@vue/reactivity';
export default {
    props:{
        fatersj:Object,
    },

     setup(props, context){
        console.log(props.fatersj);
        const fatersj=props.fatersj
        // Attribute (非响应式对象)
        console.log(context.attrs);
        // 插槽 (非响应式对象)
        console.log(context.slots)
        // 出发事件（方法）
        console.log(context.emit);
        function sonHander(){
        
          context.emit('sonclick','子组件传递给父组件')
    }
        return {
            fatersj,
            sonHander
        }
    },
    data(){
        return {
            msg:'父亲你好',
            name:'我是的儿子son'

        }
    },
    methods:{
        fqcd(){
            console.log('dianji')
            this.$emit('fater',this.msg,this.name)
        },
        
    },
    
}
</script>